import { FC } from 'react';
import { IProps } from './interfaces';

import Card from '@mui/joy/Card';
import Box from '@mui/joy/Box';

const ActionBar: FC<IProps> = ({ children }) => {
  return (
    <Box
      sx={{
        display: 'flex',
        justifyContent: 'center',
        position: 'fixed',
        bottom: '40px',
        width: 1,
        zIndex: 1300,
      }}
    >
      <Card
        size="sm"
        variant="soft"
        sx={{ display: 'flex', flexDirection: 'row' }}
      >
        {children}
      </Card>
    </Box>
  );
};

export default ActionBar;
